Draw images with warped triangles on a web server [migrated]

Posted by epologee on Programmers See other posts from Programmers or by epologee
Published on 2012-10-02T11:09:59Z Indexed on 2012/10/02 15:52 UTC
Read the original article Hit count: 247

The scenario

The Flash front end of my current project produces images that a web server needs to combine into a video. Both frame-rate and frame-resolution are sizeable enough that sending an image sequence to the back end is not feasible (in both time and client bandwidth). Instead, we're trying to recreate the image drawing on the back end as well.

Correct and slow, or incorrect and fast

The problem is that this involves quite a bit of drawing textured triangles, and two solutions we found in Python (here and there) are so inefficient, that the drawing takes about 60 seconds per frame, resulting in a whopping 7,5 hours of processing time for a 30 second clip. Unacceptable.

When using a PHP-module to send commands to ImageMagick for image manipulation, the whole process is super fast (tenths of a second per frame), but ImageMagick seems to be unable to draw triangles the way we do it in the front end, so the final results do not match. Unacceptable.

What I'm asking here, is if there's someone who would know a way to solve this issue, by any means necessary that would run on a web server.

Warping an image

Let me explain the process of the front end:

  1. Perform a Delaunay calculation on points in an image to get an evenly distributed mesh of triangles.
  2. Offset the points/vertices in the mesh, distorting or warping the image.
  3. Draw the warped triangles on a new bitmap.

Original image on the left, warped image on the right

We can send the results (coordinates) of steps 1 and 2 to the back end, to then draw the warped triangles and save it to an image on disk (or append as a frame to the video). But that last step is what I need help with.

The Question

Is there an alternative to ImageMagick that can draw triangles in a bitmap? Is there some other library, like a C library, that would allow us to do this? Or could we achieve this effect more easily by switching back end technologies, like Ruby? (.Net and Java are, unfortunately, not really options right now)

Many thanks. EP.

P.S. I'd appreciate re-tagging efforts, I don't quite know what labels to put on this question. Thanks!

© Programmers or respective owner

Related posts about image-manipulation

Related posts about cgi